<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta charset="UTF-8" />
        <title>02_事件委派-应用场景1-为什么要学习事件委派</title>
    </head>
    <body>
        <ul>
            <li>东邪</li>
            <li>西毒</li>
            <li>南帝</li>
            <li>北丐</li>
            <li>中神通</li>
            <li>杨过</li>
        </ul>

        <script>


            // var li_list = document.querySelectorAll('li');

            // for(var i = 0; i < li_list.length; i++){
            //     // 1:事件委派需要使用over和out，不可以使用enter和leave
            //     // 2：event对象中 有一个target属性  该属性代表的是当前操作的对象
            //     // 
            //     li_list[i].onmouseover = function(event){
            //         console.log(event.target.nodeName,event.target.innerHTML);
            //     }
            // }

            var ul = document.querySelector('ul');

            ul.onmouseover = function(event){
                // event的target属性 代表的是当前正在移入的对象
                console.log(event.target);
            }


        </script>
    </body>
</html>